<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

<h:head>
	<title>Meus Concursos</title>
	<link rel="stylesheet" type="text/css"
		href="#{facesContext.externalContext.requestContextPath}/public/css/style2.css" />
	<script type="text/javascript"
		src="#{facesContext.externalContext.requestContextPath}/public/javascript/jquery.flexslider-min.js"></script>
	<script type="text/javascript"
		src="#{facesContext.externalContext.requestContextPath}/public/javascript/scripts.js"></script>
	<script type="text/javascript"
		src="#{facesContext.externalContext.requestContextPath}/public/javascript/selectivizr.js"></script>

	<link rel="shortcut icon" type="image/x-icon"
		href="#{request.contextPath}/public/images/favicon.ico" />
	<link rel="shortcut icon" type="image/x-icon"
		href="#{request.contextPath}/public/images/favicon.png" />

</h:head>

<body>
	<div class="container">
		<header id="navtop"> <a href="/PDSConcursosWeb/" class="logo fleft"> <img
			src="public/images/logo5.png" alt="" />
		</a> <nav class="fright">
		<br />
		<ul>
			<li><a href="publico/index.xhtml">Acessar ao sistema</a></li>
			<li><a href="publico/cadastrarUsuario.xhtml">Cadastro de usuário</a></li>
		</ul>
		</nav> </header>


		<div class="home-page main">
			<section class="grid-wrap"> <header class="grid col-full">
			<hr />
			</header> <br />
			<br />
			<br />
			<br />
			<br />
			<br />
			<div class="grid col-one-half mq2-col-full">
				<h1>
					Meus <br /> Concursos <br />
				</h1>
				<h3>Rápido, prático, e fácil.</h3>
				<p>
					<i>Meus Concursos</i> é uma agenda de concursos online.
					 Aqui você organiza tudo o que precisa: editais, provas, entre outras coisas. Além disso, 
					 você não esquece de nada! 
					 Notificações serão enviadas para o seu e-mail com inscrição, 
					pagamento, data de liberação do cartão do candidato entre outras coisas que você desejar.
				</p>
				<br /> <br />
				<p:commandButton value="Quero me cadastrar" actionListener="#{usuarioMB.urlCadUsuario()}"
					styleClass="ui-priority-primary" />
			</div>

			<div class="slider grid col-one-half mq2-col-full">
				<div class="flexslider">
					<div class="slides">
						<div class="slide">
							<figure> <img src="public/images/lapis.jpg" alt="" /> <figcaption>
							<div>
								<h5>Concursos</h5>
								<p>Organize todos seus concursos, e se preocupe apenas em estudar.</p>
								<p>
									<a href="publico/cadastrarUsuario.xhtml">Me cadastrar</a>
								</p>
							</div>
							</figcaption> </figure>
						</div>

						<div class="slide">
							<figure> <img src="public/images/calendar-front2.jpg" alt="" /> <figcaption>
							<div>
								<h5>Datas importantes</h5>
								<p>Não esqueça mais nenhuma data. Agende lembretes em nosso sistema, e receba emails.</p>
								<p>
									<a href="publico/cadastrarUsuario.xhtml">Me cadastrar</a>
								</p>
							</div>
							</figcaption> </figure>
						</div>

						<div class="slide">
							<figure> <img src="public/images/prova.jpg" alt="" /> <figcaption>
							<div>
								<h5>Estudos</h5>
								<p style="color: black">Organize suas disciplinas e conteúdos, e estude tudo!</p>
								<p>
									<a href="publico/cadastrarUsuario.xhtml">Me cadastrar</a>
								</p>
							</div>
							</figcaption> </figure>
						</div>
					</div>
				</div>
			</div>
			</section>
			<br /> <br /> <br /> <br /> <br /> <br />
			<hr />

			<div align="center">
				<h:form>
					<p:commandLink id="ajax" oncomplete="dlg2.show()">
						<h3>
							<h:outputText value="Ver demonstracao" />
						</h3>
					</p:commandLink>
				</h:form>
			</div>

			<section class="works grid-wrap"> <header class="grid col-full">
			<hr />
			<p class="fleft">Como funciona</p>

			<!-- VAI PRA TELA DE CADASTRO DE USUARIO --> <a href="publico/cadastrarUsuario.xhtml"
				class="arrow fright">experimentar</a> </header> <figure class="grid col-one-quarter mq2-col-one-half">
			<img src="public/images/create2.png" alt="" /> <figcaption>
			<p align="center" style="font-size: 15px">Cadastre seus concursos</p>
			</figcaption> </figure> <figure class="grid col-one-quarter mq2-col-one-half"> <img
				src="public/images/study.png" alt="" /> <figcaption>
			<p align="center" style="font-size: 15px">Gerencie seus estudos</p>
			</figcaption> </figure> <figure class="grid col-one-quarter mq2-col-one-half"> <img
				src="public/images/calendar.png" alt="" /> <figcaption>
			<p align="center" style="font-size: 15px">Crie lembretes</p>
			</figcaption> </figure> <figure class="grid col-one-quarter mq2-col-one-half"> <img
				src="public/images/watch.png" alt="" /> <figcaption>
			<p align="center" style="font-size: 15px">Não esqueça nada!</p>
			</figcaption> </figure> </section>
		</div>

		<br /> <br /> <br /> <br /> <br /> <br />

		<div class="divide-top">
			<p>Tem alguma sugestão para nós? Alguma idéia para acrescentar neste sistema? Nos envie, ficaremos agradecidos.</p>
			<br /> <br />
			<h:form id="enviarSugestao">
				<p:inputText id="nome" style="width: 30%; height: 30px;" />
				<p:watermark for="nome" value="Seu nome" />
				<br />
				<p:inputTextarea id="sugestao" rows="1" cols="3" />
				<p:watermark for="sugestao" value="Sua sugestao" />
				<br />
				<br />
				<p:commandButton value="Enviar" actionListener="#" />
			</h:form>
			<br /> <br />
		</div>

		<div class="divide-top">
			<footer class="grid-wrap">
			<div class="grid col-one-third social">
				<h:outputText value="Meus Concursos. IFRN 2012.2." />
			</div>
			</footer>
		</div>
	</div>


	<p:dialog id="videoModal" widgetVar="dlg2" modal="true" height="350">
		<p:media value="http://www.youtube.com/v/KZnUr8lcqjo" width="420" height="315" player="flash" />
	</p:dialog>
</body>
</html>